<template>
    <view class="eq-item-box">
        <view class="eq-item-main" @click="goDetail()">
            <view class="eq-item-main-title-box">
                <text class="eq-item-main-title">{{ props.itemData.productName }}</text>
                <view class="eq-item-state" :class="props.itemData.status != 4 ? 'eq-item-state-complete' : ''">
                    {{ props.itemData.status == 4 ? '已完成' : '未完成' }}</view>
            </view>
            <view class="eq-item-main-list">
                <van-row :gutter="10">
                    <van-col span="14">
                        <view class="eq-item-main-item">
                            <text class="eq-item-main-item-title">批次号:</text>
                            <text class="eq-item-main-item-text">{{ props.itemData.batchCode }}</text>
                        </view>
                    </van-col>
                    <van-col span="10">
                        <view class="eq-item-main-item">
                            <text class="eq-item-main-item-title">产品编号:</text>
                            <text class="eq-item-main-item-text">{{ props.itemData.productCode }}</text>
                        </view>
                    </van-col>
                    <van-col span="14">
                        <view class="eq-item-main-item">
                            <text class="eq-item-main-item-title">当前工序:</text>
                            <text class="eq-item-main-item-text">{{ props.itemData.procedureName }}</text>
                        </view>
                    </van-col>
                    <van-col span="10">
                        <view class="eq-item-main-item">
                            <text class="eq-item-main-item-title">规格:</text>
                            <text class="eq-item-main-item-text">{{ props.itemData.productSpecs }}</text>
                        </view>
                    </van-col>
                    <!-- <van-col span="10">
                        <view class="eq-item-main-item">
                            <text class="eq-item-main-item-title">型号:</text>
                            <text class="eq-item-main-item-text">{{ props.itemData.productModel }}</text>
                        </view>
                    </van-col> -->
                    <van-col span="14">
                        <view class="eq-item-main-item">
                            <text class="eq-item-main-item-title">颜色:</text>
                            <text class="eq-item-main-item-text">{{ props.itemData.productColor }}</text>
                        </view>
                    </van-col>
                    <van-col span="10">
                        <view class="eq-item-main-item">
                            <text class="eq-item-main-item-title">完成日期:</text>
                            <text class="eq-item-main-item-text">{{ props.itemData.planEndTime }}</text>
                        </view>
                    </van-col>
                    <van-col span="14">
                        <view class="eq-item-main-item">
                            <text class="eq-item-main-item-title">模具编码:</text>
                            <text class="eq-item-main-item-text">{{ props.itemData.mouldCode }}</text>
                        </view>
                    </van-col>
                    <van-col span="10">
                        <view class="eq-item-main-item">
                            <text class="eq-item-main-item-title">模具穴数:</text>
                            <text class="eq-item-main-item-text">{{ props.itemData.mouldHoles }}</text>
                        </view>
                    </van-col>
                </van-row>
            </view>
        </view>
    </view>
</template>
  
<script setup>

const emit = defineEmits(['turnUp'])
const props = defineProps(['itemData','itemIndex'])

const goDetail = () => {
    let params = "taskReportId=" + props.itemData.taskReportId + "&deviceMouldId=" + props.itemData.deviceMouldId
    uni.navigateTo({
        url: '/pages/detail/index?' + params
    });
}

</script>
  
<style lang="scss" scoped>
.eq-item-box {
    margin-top: 20rpx;
    padding: 0 40rpx;
}



.van-button {
    width: 112rpx;
    height: 64rpx;
    line-height: 64rpx;
    background: radial-gradient(125% 125% at 85.42% 0%, #85D3FF 0%, #FE9B4B 0.01%, #F47814 100%);
    border-radius: 8rpx;
    font-weight: 500;
    font-size: 28rpx;
    color: #FFFFFF;
    border: none;
    flex: none;
}

.eq-item-main {
    background: rgba(255, 255, 255, 0.8);
    border-radius: 20rpx;
    padding: 40rpx;
    margin-top: 20rpx;

    .eq-item-main-title-box {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .eq-item-main-title {
        font-weight: 500;
        font-size: 32rpx;
        line-height: 32rpx;
        color: #171717;
    }

    .eq-item-state {
        flex: none;
        width: 100rpx;
        height: 48rpx;
        background: linear-gradient(0deg, #FFECDD, #FFECDD);
        border-radius: 4rpx;
        text-align: center;
        line-height: 48rpx;
        font-weight: 500;
        font-size: 26rpx;
        color: #F57916;
    }

    .eq-item-state-complete {
        background: linear-gradient(0deg, #F0F0F0, #F0F0F0);
        color: #9B9590;
    }

    .eq-item-main-list {
        .eq-item-main-item {
            display: flex;
            align-items: center;
            font-weight: 400;
            font-size: 24rpx;
            margin-top: 20rpx;

            .eq-item-main-item-title {
                color: #8F92A1;
                margin-right: 5rpx;
            }

            .eq-item-main-item-text {
                color: #171717;
            }
        }
    }
}


</style>
  